.Grid {
    width: 100%;
    display: flex;
    // height: calc(100vh - 142px);
  
    .table-box {
      width: 100%;
      box-sizing: border-box;
      height: calc(100vh - 142px);
      display: grid;
      grid-template-columns: repeat(1, 1fr);
      grid-template-rows: auto 1fr;
      margin-left: 5px;
  
      .headerBar {
        background-color: white;
        padding: 10px;
        padding-bottom: 0px;
      }
  
    }
  }
  
  
  
  
  /* 自定义 Element Plus Tabs 样式 */
  .el-tabs__nav-scroll {
    display: flex;
    justify-content: center;
    padding: 10px;
  }
  
  .el-tabs__item {
    font-weight: bold;
    padding: 0 20px;
    position: relative;
  }
  
  .el-tabs__item.is-active {
    background-color: #409EFF;
    color: white;
    border-radius: 4px;
  }
  
  .custom-label {
    position: relative;
    display: inline-block;
  }
  
  .badge {
    background-color: red;
    color: white;
    border-radius: 50%;
    padding: 2px 6px;
    font-size: 10px;
    text-align: center;
    width: 6px;
    /* 固定宽度 */
    height: 12px;
    /* 固定高度 */
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 2px;
    right: -19px
  }
  
  
  .order-detail {
    margin-right: 20px;
    margin-left: 20px;
    .order-header-info{
      display: flex;
      justify-content: space-between;
      margin-bottom: 10px;
      .clearfix{
        display: flex;
        align-items: center;
        .clearfix-text{
            margin-right: 20px;
            .clearfix-text-d{
                color: #606266;
            }
            .clearfix-text-h{
                font-weight :  bold;
                font-size: 16px;
            }
        }

        .clearfix-button{
            font-size: 12px;
             padding: 9px;
             padding-top: 4px;
             padding-bottom: 1px;
        }
      }

      .text-item{
        font-size: 14px;
        color: #606266;
      }

    }
    .order-info{
        padding: 20px;
        padding-top: 30px;
        .details{
            .details-top{
                display: flex;
                width: 50%;
                justify-content: space-between
    
            }
            .details-middle{
                margin: 20px 0 20px 0;
            };
            .remark{
                background-color: #fff9f0;
                padding: 8px;
                display: flex;
                align-items: center; /* 垂直居中 */
                .bj{
                    padding: 10px;
                    background-color: #f1d77391;
                    width: 40px; /* 根据需要调整宽度 */
                    height: 5px; /* 根据需要调整高度 */
                    display: flex;
                    justify-content: center; /* 水平居中 */
                    align-items: center; /* 垂直居中 */
                    color: black; /* 文本颜色 */
                    border: none; /* 移除默认边框 */
                   
                    font-size: 14px; /* 可选：根据需要调整字体大小 */

                }
                .remark-text{
                    margin-left: 20px;
                }
            }
        }

        .product-info{
            display: flex;
            margin-top: 30px;
            .product-item-left{
                width: 10%;
              
            }
            .product-item-right{
              width: 90%;
                .product-item-right-top{
                  margin-top: 10px;
                    display: flex;
                    .product-item-right-top1{
                      color: black;
                    }
                    .product-item-right-top3{
                        margin-left: 50px;
                        color: black;
                    }
                }

                .product-item-right-top11{
                  display: flex;
                  flex-wrap: wrap; /* 当项目超出容器宽度时自动换行 */
                  gap: 30px; /* 可选：设置项目之间的间距 */
                  .roduct-item-right-top11-childer{
                    // flex: 1 1 calc(20% - 10px); /* 每个项目的基准宽度为20%，减去间距 */
                    // box-sizing: border-box; /* 确保内边距和边框不会增加元素的实际宽度 */
                    /* 下面是可选样式，用于展示效果 */
                    // padding: 20px;
                    // // background-color: #f0f0f0;
                    // text-align: center;
                    display: flex;
                    align-items: center;
                    .el-image{
                      margin-right: 10px;
                    }
                    .product-item-right-top3{
                      margin-left: 20px;
                    }
                  }
                }
                .product-item-right-button{
                    margin-top: 10px;
                    .product-item-right-button1{
                        color: black;
                    }
                    .product-item-right-button2{
                        margin-left: 10px;
                        color: red;
                    }
                }
            }
        }
    }
  
    .action-buttons{
      justify-content: space-between;
      display: flex;
    }
  }
 
  